<template>
	<view>
		<u-navbar back-icon-color="#FFFFFF" :back-text-style="backText" title-color="#FFFFFF" :background="barbg" back-text="返回" title="点位管理">
			<view class="navbar-right" slot="right" @click="addMotorcadeManagement()">添加</view>
		</u-navbar>
		<view class="content">
			<view class="item" v-for="(item, index) in dataList" :key="index" >
				<view class="info-box">
					
					<u-row gutter="<0></0>"  class="gotoUrl" >
						<u-col span="6" @click="details(item)"><view class="info-left title" @>查看详情</view></u-col>
						<u-col span="6" @click="details(item)">
							<view class="info-right"><image class="left-img" src="../../../static/right.png" mode=""></image></view>
						</u-col>
					</u-row>
					<u-line color="#efefef" />
					<u-row gutter="0">
						<u-col span="6"><view class="info-left">点位名称</view></u-col>
						<u-col span="6">
							<view class="info-right">{{ item.name }}</view>
						</u-col>
					</u-row>
					<u-line color="#efefef" />
					<u-row gutter="0">
						<u-col span="6"><view class="info-left">类型</view></u-col>
						<u-col span="6">
							<view class="info-right" v-if="item.type === '1' ">作业点</view>
							<view class="info-right" v-if="item.type === '2' ">卸土点</view>
						</u-col>
					</u-row>
				</view>
			</view>
			<view v-show="isLoadMore">
				<uni-load-more :status="loadStatus" :contentText="text"></uni-load-more>
			</view>
		</view>
		<view class="divider"><u-divider bg-color="#eaf1ff">END</u-divider></view>
		
		<kModel ref="kModel" />
	</view>
</template>

<script>
import { getSite } from "@/api/site.js"
export default {
	data() {
		return {
			barbg: {
				background: '#5c92ff'
			},
			backText: {
				color: '#FFFFFF'
			},
			dataList:[],
			loadStatus: 'loading',
			isLoadMore: false,
			isOnshow: true,
			prevPage: null,
			text: {contentdown: "上拉显示更多",contentrefresh: "正在加载...",contentnomore: ""},
			queryInfo:{
				projectId: null,
				page: 1,
				count: 6
			},
		};
	},
	components: {
		
	},
	onShow() {
		var pages = getCurrentPages();
		this.prevPage = pages[pages.length - 1];
		if(this.prevPage.brand === true ){
			this.getSiteData()
		}
		if (this.prevPage.delete === true){
			this.getSiteData()
		}
		// console.log(brand)
		if (this.isOnshow === true) {
			this.getSiteData()
		}
	},
	methods: {
		addMotorcadeManagement() {
			uni.navigateTo({
				url: './addSite/index'
			});
		},
		details(item) {
			// console.log(item.id)
			let url = '/pages/project/pointMangement/details/index'
			
			this.$urlTo.togo(url,{id: item.id})
			// uni.navigateTo({
			// 	url: './details/index?id='+id
			// });
		},
		onReachBottom() {
			if (!this.isLoadMore) { //此处判断，上锁，防止重复请求
				this.isLoadMore = true
				this.queryInfo.page += 1
				this.getSiteData()
			}
		},
		getSiteData(){
			this.queryInfo.projectId = uni.getStorageSync('id')
			if(this.prevPage.delete === true){
				this.queryInfo.page = 1
				this.queryInfo.count = 8
			}
			getSite(this.queryInfo).then(res =>{
				console.log(res)
				if (res.code === 1) {
						if(res.result.data) {
							if(this.prevPage.brand === true){
								// this.dataList = this.dataList.unshift(res.result.data.slice(res.result.data.length - 1))
								this.dataList.splice(0, 0, res.result.data.slice(res.result.data.length - 1)[0])
								this.prevPage.brand = false
							} else if (this.prevPage.delete === true){
								this.dataList = res.result.data
								this.prevPage.delete = false
							} else {
								this.dataList = this.dataList.concat(res.result.data)
							}
							// this.dataList = this.dataList.concat(res.result.data)
							if (res.result.data.length < this.queryInfo.count) {
								this.isLoadMore = true
								this.loadStatus = 'nomore'
							} else {
								this.isLoadMore = false
							}
						} else {
							this.isLoadMore = true
							this.loadStatus = 'nomore'
						}
					} else {
						uni.showToast({
							title: res.data.msg,
							icon: 'none'
						})
						this.isLoadMore = false
						if (this.page > 1) {
							this.page -= 1
						}
					}
					// console.log(this.dataList)
				})

				if (this.isOnshow === true) {
					this.isOnshow = false
				}
				// this.dataList = res.result.data
				
			
		}
	}
};
</script>

<style lang="scss" scoped>
.navbar-right {
	padding: 0px 40rpx;
	color: #ffffff;
}
.content {
	.item {
		padding: 20rpx;
		margin-bottom: 1rpx;
		padding: 20rpx 40rpx;
		.info-box {
			background-color: #ffffff;
			border-radius: 10rpx;
			padding: 0rpx 40rpx;
			.info-left {
				font-size: 30rpx;
				font-weight: normal;
				font-stretch: normal;
				line-height: 40rpx;
				letter-spacing: 1rpx;
				color: #b1b8c8;
				padding: 20rpx 0px;
			}
			.info-right {
				font-size: 30rpx;
				font-weight: normal;
				font-stretch: normal;
				line-height: 40rpx;
				letter-spacing: 1rpx;
				color: #2c3240;
				text-align: right;
				font-weight: bold;
				padding: 20rpx 0px;
			}
			.left-img {
				width: 20rpx;
				height: 29rpx;
			}
			.title{
				color: #5c92ff!important;
				font-weight: bold;
			}
		}
	}
}
.divider {
	margin-top: 50rpx;
}
.gotoUrl{
	&:active{
		background-color: #f7f7f7;
	}
}
</style>
